import path from 'path'
const postcssPxToViewport = require('postcss-px-to-viewport')
const {whenProd} = require('@craco/craco')
module.exports = {
  webpack: {
    alias: {
      '@': path.resolve(__dirname, 'src'),
      '@scss': path.resolve(__dirname, 'src', 'assets', 'styles')
    },
    style: {
      postcss: {
        plugins: [
          postcssPxToViewport({
            viewportWidth: 375
          })
        ]
      }
    },
    configure:(webpackConfig:any)=>{
      whenProd(()=>{
        webpackConfig.externals ={
          react:'React',
          'react-dom':'ReactDOM'
        }
      })
      return webpackConfig
    }
  },
}
// module.exports = {
//   webpack: {
//     entry: './src/index.tsx',
//     output: {
//       filename: 'js/[content:hash].js',
//       path: path.resolve(__dirname, 'dist'),
//       chunkFilename: 'js/[content:hash]_chunk.js',
//       pubilcPath: '/'
//     },
//     alias: {
//       '@': path.resolve(__dirname, 'src'),
//       '@scss': path.resolve(__dirname, 'src', 'assets', 'styles')
//     },
//     style: {
//       postcss: {
//         plugins: [
//           postcssPxToViewport({
//             viewportWidth: 375
//           })
//         ]
//       }
//     }
//   }
// }
